import {Component, OnInit ,Input} from '@angular/core';
import { SelectComponent } from './select.component';
import { SafeStyle, DomSanitizer } from '@angular/platform-browser';
import { trigger, state, style, animate, transition } from '@angular/animations';

@Component({
  selector: 'el-select-dropdown',
  templateUrl: './select-dropdown.component.html',
  animations: [
    trigger('state', [
        state('true', style({
            opacity: 1,
            height: '*',
            display: 'block',
        })),
        state('false', style({
            opacity: 0,
            height: 0,
            display: 'none',
        })),
        transition('* => *', animate("250ms ease-in-out")),
    ])
],
})
export class SelectDropdownComponent implements OnInit {
     rootSelect:any;
    private sanitizer:any;
    @Input() isActived: boolean=false;
    @Input() multiple: boolean=false;
    @Input() popperClass: string='';
    @Input() dropdownStyles!: SafeStyle;

    constructor(rootSelect: SelectComponent, sanitizer: DomSanitizer){
      this.rootSelect = rootSelect;
      this.sanitizer = sanitizer;
    };
  

  ngOnInit(): void {
    var _this = this;
    var /** @type {?} */ firstStyle = 'display: none; opacity: 0; height: 0;';
    this.dropdownStyles = this.sanitizer.bypassSecurityTrustStyle(firstStyle);
    setTimeout(function () {
        var /** @type {?} */ styles = "min-width: " + _this.rootSelect.selfWidth + "px; " + (firstStyle || '');
        _this.dropdownStyles = _this.sanitizer.bypassSecurityTrustStyle(styles);
        _this.popperClass = _this.rootSelect.popperClass;
        firstStyle = '';
    }, 0);
  }

  
  
}
